<ion-header>
  //<ion-navbar>
    <ion-navbar color="primary">
    <ion-title>
      //Ionic Blank
      待办事项
    </ion-title>
    <ion-buttons end>
      <button ion-button icon-left (click)="addTask()">
        <ion-icon name="add"></ion-icon> <!--新增--> 
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content
    pullingIcon = "arrow-dropdown"
    pullingText = "下拉刷新"
    refreshingSpinner = "circles"
    refreshingText = "刷新...."
    >
    </ion-refresher-content>
  </ion-refresher>
  //The world is your oyster.
  //<p>
   // If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
 // </p>
 <ion-list>
  //<ion-item *ngFor="let task of tasks">{{task.title}}</ion-item>
  <ion-item-sliding #slidingItem *ngFor="let task of tasks">
    <ion-item [ngClass]="{'task_done': task.status === 'done'}" (click)="editTask(task)">{{task.title}}</ion-item>
    //<ion-item >{{task.title}}</ion-item>
    //<ion-item-options side="right">
      //<button ion-button icon-only color="secondary" (click)="markAsDone(task)">
        <ion-item [ngClass]="{'task_done': task.status === 'done'}" >{{task.title}}</ion-item>
      <ion-item-options side="right" (ionSwipe)="removeTask(slidingItem, task)">
        <button ion-button icon-only color="secondary" (click)="markAsDone(slidingItem, task)">
        <ion-icon name="checkmark"></ion-icon>
      </button>
      <button ion-button icon-only color="danger" (click)="removeTask(task)">
        <ion-icon name="trash"></ion-icon>
      </button>
    </ion-item-options>
 </ion-item-sliding>
</ion-list>
</ion-content>
